<template>
  <van-tabs v-model="active">
    <van-tab :title="titleDate">
      <van-datetime-picker
        ref="DatetimePicker"
        v-model="currentDate"
        type="date"
        :min-date="minDate"
        :show-toolbar="false"
        @change="onConfirm"
      />
    </van-tab>
    <van-tab :title="titleTime">
      <van-picker
        :columns="columns"
        :default-index="dafaultPicker"
        @change="changeSelect"
      />
    </van-tab>
  </van-tabs>
</template>

<script type="text/javascript">
  export default {
    props: {
      values: {
        type: String,
        require: true
      },
      limit: {
        type: String,
        require: true
      }
    }, 
    data() {
      return {
        active: 0,
        minDate: new Date(),
        currentDate: '',
        titleDate: '',
        titleTime: '',   //默认为上午
        columns: [
        { text: '上午', disabled: false },
        { text: '下午', disabled: false }],
        dafaultPicker: 0,  //选择器的默认选中项
      }
    },
    watch: {
      'titleTime': {
        handler(newV, oldV) {
          if (newV == '全天') {
            this.columns = [
            { text: '上午', disabled: true },
            { text: '下午', disabled: true }]
          }
        }
      }
    },
    mounted(){
      // console.log(this.values)
      let arr = this.values.split(" ")
      this.titleDate = arr[0]      //日期
      let hour = new Date().getHours()
      
      // 判断限制条件
      if (this.limit == '0.5') {
        if (arr[1] == '') {
          this.titleTime = hour > 12 ? '下午':'上午'
        } else if(arr[1] == 'null'){
          this.titleTime = '全天'
        } else {
          this.titleTime = arr[1]  //上下午
        }
      } else {
        this.titleTime = '全天'
      }
      // 设置默认值
      this.currentDate = new Date(this.titleDate)
      this.dafaultPicker = this.titleTime == '上午'? 0 : 1
    },
    methods: {
      getData() {
        let json = this.titleDate + " " + this.titleTime
        return json
      },
      // 日期change事件
      onConfirm() {
        this.titleDate = this.$common.convertDate(this.currentDate.valueOf(), 'Y-M-D')
      },
      // 下拉选择事件
      changeSelect(picker, values, index) {
        console.log(picker, values, index)
        this.titleTime = values.text
      }
    }
  }
</script>

<style type="text/css" lang="less">
  
</style>